<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <link rel="stylesheet" href="../plugins/layui/css/layui.css" media="all" />
    <script src="../plugins/layui/layui.js"></script>
    <script src="../js/vue.min.js"></script>
    <script src="../js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="app">
    <fieldset class="layui-elem-field" style="width: 25%;margin: auto;margin-top: 80px">
        <legend>用户列表</legend>
        <table class="layui-table" lay-skin="nob" style="width: 80%; margin: auto;">
            <tr>
                <td>原密码：</td>
                <td><input type="password" class="layui-input" id="oldupwd"/></td>
            </tr>
            <tr>
                <td>新密码：</td>
                <td><input type="password" class="layui-input" id="newupwd" /></td>
            </tr>
            <tr>
                <td>确认密码：</td>
                <td><input type="password" class="layui-input" id="renewupwd" onblur="checkrenewpwd()"/></td>
            </tr>
            <tr>
                <td><button class="layui-btn layui-btn-primary" v-on:click="save()" >保存</button></td>
                <td><button class="layui-btn layui-btn-primary" v-on:click="clear()" >重置</button></td>
            </tr>
        </table>
    </fieldset>
</div>
</body>
<script>
    //检查新密码和确定密码是否一致
    function checkrenewpwd() {
        if($("#newupwd").val()!==$("#renewupwd").val()){
            alert("两次密码不一致！");
            $("#newupwd").val("");
            $("#renewupwd").val("");
            return false;
        }else {
            return true;
        }
    }
    var flag=true;
    var v = new Vue({
        el: "#app",
        data: {
            datalist: []
        },
        methods: {
            save:function () {
                var oldupwds=$("#oldupwd").val();
                var newupwds=$("#newupwd").val();
                var renewupwds=$("#renewupwd").val()
                console.log(flag);
                console.log(oldupwds!=="");
                console.log(newupwds!=="")
                if(checkrenewpwd()&&oldupwds!==""&&newupwds!==""&&renewupwds!==""){
                    var flag=confirm("确定修改吗？");
                    if(flag){
                        $.ajax({
                            url:"../repwd",
                            type:"get",
                            async: false,//使用同步的方式,true为异步方式
                            data:{
                                userName : localStorage.getItem("userName"),
                                userPwd : oldupwds,
                                newPwd : newupwds
                            },
                            success:function(data){
                                if(data.msg=="ok"){
                                    alert("密码修改成功");
                                    $("#oldupwd").val("");
                                    $("#newupwd").val("");
                                    $("#renewupwd").val("");
                                }else{
                                    alert(data.msg)
                                }
                            },
                            fail:function(){
                                alert("修改失败")
                            }
                        })
                    }
                }else {
                    alert("修改失败，信息不正确，请重新输入");
                }

            },
            clear:function () {
                window.location.reload();
            }
        }
    });
</script>
</html>
